<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<!-- 引入element-ui样式 -->
		<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
		<style>

		</style>
	</head>
	<body>
		<div id="caseInfo">
			<h2>医嘱查询</h2>
			<el-form ref="form" label-width="80px">
				<el-form-item label="身份证件">
					<el-input v-model="patinForm.patientIdCard" @blur="findUserInfo" placeholder="请输入身份证" style="width: 200px;"></el-input>
				</el-form-item>
				<el-form-item label="姓名">
					<el-input v-model="patinForm.patientName" :disabled="true" style="width: 150px;"></el-input>
				</el-form-item>
				<el-form-item label="性别">
					<el-input v-model="patinForm.patientSex" :disabled="true" style="width: 150px;"></el-input>
				</el-form-item>
				<el-form-item label="年龄">
					<el-input v-model="patinForm.patientAge" :disabled="true" style="width: 150px;"></el-input>
				</el-form-item>

				<el-form-item label="病例ID">
					<el-input v-model="patinForm.caseId" placeholder="选填 - 可输入病例ID精确查询" style="width: 220px;"></el-input>
				</el-form-item>

				<el-button type="primary" @click="findCaseInfo">查询病例</el-button>
			</el-form>


			<template>
				<el-table :data="CaseInfoForm" stripe style="width: 100%">

					<el-table-column prop="actOrderInfoId" label="医嘱修改ID" width="80"></el-table-column>
					<el-table-column prop="actOrderId" label="医嘱ID"></el-table-column>
					<el-table-column prop="caseId" label="病例ID"></el-table-column>
					<el-table-column prop="actOrderType" label="医嘱类型" width="150"></el-table-column>
					<el-table-column prop="actOrderResult" label="医嘱内容" width="120"></el-table-column>
					<el-table-column prop="actOrderStartTime" label="医嘱开始时间" width="120"></el-table-column>
					<el-table-column prop="actOrderEndTime" label="医嘱结束时间" width="180"></el-table-column>
					<el-table-column prop="actOrderStartTime" label="医嘱修改时间"></el-table-column>
					<el-table-column prop="doctorName" label="医生姓名"></el-table-column>
				</el-table>
			</template>
		</div>


		<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
		<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
		<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
		<!-- 引入组件库 -->
		<script src="https://unpkg.com/element-ui/lib/index.js"></script>

		<script>
			var app = new Vue({
				el: "#caseInfo",
				data: {
					patinForm: {
						patientIdCard: "",
						patientName: "",
						patientSex: "",
						patientAge: "",
						caseId: null,
					},
					patientIdCard: "",
					CaseInfoForm: [],
				},
				methods: {
					findCaseInfo: function() {
						var t = this;
						if (t.patinForm.patientIdCard == "") {
							alert("请输入身份证哦~")
							return;
						}
						axios.get('http://192.168.80.13:8080/medical/act-order-info/selectPatientByIdCard', {
							params: {
								idCard: t.patinForm.patientIdCard,
								caseId:t.patinForm.caseId,
							}
						}).then(function(data) {
							t.CaseInfoForm = [];
							console.log("得到数据~~~~~~~~")
							console.log(data)
							t.CaseInfoForm = data.data.data
						}).catch(function(Error) {
							console.log(Error)
						})
					},
					//查询用户信息
					findUserInfo: function() {
						var t = this;
						axios.get('http://192.168.80.13:8080/medical/patient/selectPatientByIdCard', {
							params: {
								idCard: t.patinForm.patientIdCard
							}
						}).then(function(data) {
							if (data.data.success) {
								var d = data.data.data;
								var tp = t.patinForm
								var tc = t.caseForm
								//判断返回的结果
								if (data.data.data == null) {
									alert("请输入正确的身份证件")
									return;
								}
								// 给patinForm表单中的数据赋值
								tp.patientName = d.patientName;
								tp.patientSex = d.patientSex;
								tp.patientAge = d.patientAge;
							}
						}).catch(function(Error) {
							console.log(Error)
						})
					},
				}

			})
		</script>


	</body>
</html>
